/**
 * author: liduanjie
 * function: comfrim, alert, valid component;
 * component select
 */

// $(function() {
	var height = $('#layout > #main').height();
	$('#layout > #menu').height(height);	

	/**
	 * confirm component
	 * 外调组件接口(DOM)
	 * binding dom:
	 * <a data-widht="" data-title="" 
	 * data-info="" data-url="" data-okValue="" data-cancelValue=""></a>
	 */
	$('a[data-click="confirm"], button[data-click="confirm"]').on('click', function(e) {
		e.preventDefault();
		var width = $(this).data('width');
		var title = $(this).data('title');
		var url = $(this).data('url');
		var info = $(this).data('message');
		var okValue = $(this).data('okValue');
		var cancelValue = $(this).data('cancelValue');

		var dialog = {
			url: url,
			info: info,
			width: width,
			title: title, 
			ok: okValue,
			cancel: cancelValue
		};
		cusDialog(dialog, function() {}, function() {})
	})

	/**
	 * 异步加载的时候用到
	 */
	function renderConfirm($html) {
		$html.find('a[data-click="confirm"], button[data-click="confirm"]').on('click', function(e) {
			e.preventDefault();
			var width = $(this).data('width');
			var title = $(this).data('title');
			var url = $(this).data('url');
			var info = $(this).data('message');
			var okValue = $(this).data('okValue');
			var cancelValue = $(this).data('cancelValue');

			var dialog = {
				url: url,
				info: info,
				width: width,
				title: title, 
				ok: okValue,
				cancel: cancelValue
			};
			cusDialog(dialog, function() {}, function() {})
	})
	}

	/**
	 * 内调组件接口(JAVASCRIPT)
	 * @param {object} dialogPara 
	 * dialog => {width: '', title: '', okValue: '', cancelValue: '': ''}
	 */
	var cusDialog = function(dialogPara, success, fail) {
		var width, title, okValue, cancelValue;
		dialogPara.width ? width = dialogPara.width : width = 250;
		dialogPara.title ? title = dialogPara.title : title = '提示';
		dialogPara.ok ? okValue = dialogPara.ok : okValue = '确定';
		dialogPara.cancel ? cancelValue = dialogPara.cancel : cancelValue = '取消';
		dialogPara.info ? info = dialogPara.info : info = '';

		var d = dialog ({
			title: title,
			content: info,
			okValue: okValue,
			ok: function() {
				if (dialogPara.url) {
					window.location.href = dialogPara.url;
				}
				if (success) {
					success();
				}
				// return false;
			},	
			cancelValue: cancelValue,
			cancel: function() {
				if (fail) {
					fail();
				}
			},
			quickClose: true,
			fixed: true
		}).width(250).showModal();
	}

	/**
	 * model component
	 * model 外调组件(DOM)
	 * building dom： <a data-model="targetTemplate" 
	 * data-width="200" data-title="提交表单"> 
	 * target template:  <div id="targetTemplate" style="display:none">
	 * inside is form and button</div>
	 */
	// form 表单的模态框 多个对应 由于是form表单，所以按钮直接加在了template里面

	$('a[data-click="model"],button[data-click="model"]').on('click', function(e){
		e.preventDefault();
		var id = $(this).data('id')
		var width = $(this).data('width');
		var model = $(this).data('model');
		var title = $(this).data('title');

		var para = {
			title: title,
			model: model,
			width: width,
			id: id
		}
		cusModal(para);
	})

	/**
	 * 异步加载的时候要用到
	 */
	function renderModal ($html) {
		$html.find('a[data-click="model"],button[data-click="model"]').on('click', function(e){
			e.preventDefault();
			var id = $(this).data('id')
			var width = $(this).data('width');
			var model = $(this).data('model');
			var title = $(this).data('title');

			var para = {
				title: title,
				model: model,
				width: width,
				id: id
			}
			cusModal(para);
		})
	}

	/**
	 * 内调组件接口(JAVASCRIPT)
	 * para => {title: '', model: '', width: '', id: ''}
	 * add： id parameter for advoing invoking twice 
	 */

	var cusModal = function(para) {
		var title, content, width;
		para.title ? title = para.title : title = '提示';
		para.model ? model = para.model : model = '';
		para.width ? width = para.width : width = 280;
		para.id ? id = para.id : id = '';

		var $content = document.getElementById(para.model);
		var d = dialog({
	            id: id,
	            title: title,
	            content: $content,
	            quickClose: true,
	        }).width(width).show();
	}



	/**
	 * async loading(iframe component sometimes not useful can seperate)
	 */



	/**
	 * valid comoponent
	 * usage: add '.adminUI-form' to bind the form-valid, use [data-valid = "valid name"] attribute to
	 * bind what you want to valid
	 * 不支持同时在一个页面验证两种相同类型
	 */

	// var data = {
	// 	mobile: {istrue: false: ''},
	// 	email: {istrue: false: ''},
	// 	number: {istrue:false: ''},
	// 	integer: {istrue:false: ''},
	// }

	var data = {
		mobile: false,
		email: false,
		number: false,
		integer: false,
		checkbox: false,
		apiKey: false,
		peroid: false,
		repassword: false,
	}
		

	function judge (value, reg, valid) {
		if (value.match(reg)) {
			$('.adminUI-error').html('');
			data[valid] = false;
		} else {
			// $('.adminUI-error').html('<span style="color:red;font-size: 12px;"><i class="fa fa-times-circle"></i> ' + info + '</span>')
			data[valid] = true;
		}
	}

	/**
	 * invalid_reset
	 */

	invalid_reset();

	function invalid_reset () {
		$('input[data-valid]').on('blur', function() {
			var valid = $(this).data('valid');
			console.log(data[valid])
			switch (valid){
				case 'mobile': 
					if(data['mobile']) {
						var dialog = {
							info: '请填写正确的手机号！！'
						}
						cusDialog(dialog)
					}
					break;
				case 'email': 
					if (data['email']) {
						var dialog = {
							info: '你填写的电子邮箱地址有误！！'
						}
						cusDialog(dialog)
					}
					break;
				case 'number': 
					if (data['number']){ 
						$(this).val(0);
						data[valid] = false;
					}
					break;
				case 'integer':
					if (data['integer']) { 
						$(this).val(0);
						data[valid] = false;
					}
					break;
				case 'apiKey':
					if(data['apiKey']) {
						var dialog = {
							info: '您填写的密匙不正确！！<br/>密匙有32位，由0-9a-zA-Z组成的字符串'
						}
						cusDialog(dialog);
					}
				case 'peroid':
					if(data['peroid']) {
						$(this).val(1);
						data[valid] = false;
					}
				case 'repassword':
					if (data['repassword']) {
						var dialog = {
							info: '您填写的两次密码不一致！！'
						}
						cusDialog(dialog);
					}
			}
		})
	}

	/**
	 * 必填的checkbox
	 */
	$('input[data-valid="checkbox"]').on('change', function() {
		if ($(this).is(":checked")) {
			data.checkbox = false;
		} else {
			data.checkbox = true;
		}
		// if (value == '')
	})

	/**
	 * 判断api key
	 */
	$('input[data-valid="apiKey"]').on('change', function() {
		var value = $(this).val();
		var reg = /\w{32}/g;
		var data = 'apiKey';
		judge(value, reg, data);
	})

	/**
	 * 判断手机
	 */
	$('input[data-valid="mobile"]').on('change', function() {
		var value = $(this).val();
		var reg = /^1[3|4|5|7|8]\d{9}$/g;
		var data = 'mobile';
		judge(value, reg, data);
	})	

	/**
	 * 判断周期
	 */
	$('input[data-valid="peroid"]').on('change', function() {
		var value = $(this).val();
		var reg = /^\+?[1-9][0-9]*$/g; 
		var data = 'peroid';
		judge(value, reg, data);
	})

	/**
	 * 判断邮箱
	 */
	$('input[data-valid="email"]').on('change', function() {
		var value = $(this).val();
		var reg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/g;
		var data = 'email';
		judge(value, reg, data);
	})


	/**
	 * 判断整数
	 */
	$('input[data-valid="integer"]').on('change', function() {
		var value = $(this).val();
		var reg = /^\d+$/gi;
		var data = 'integer';
		judge(value, reg, data);
	})

	/**
	 * 判断数字
	 */
	$('input[data-valid="number"]').on('change', function() {	
		var value = $(this).val();
		var reg = /^(-?\d+[.]?\d+)$|^(-?\d+)$/g;
		var data = 'number';
		var $this = $(this);

		judge(value, reg, data,$this);
	})

	 //判断数字(AJAX)
	 function validNum ($html) {
	 	$html.find('input[data-valid="number"]').on('change', function() {	
			var value = $(this).val();
			var reg = /^(-?\d+[.]?\d+)$|^(-?\d+)$/g;
			var data = 'number';
			var $this = $(this);

			judge(value, reg, data,$this);
		})
	 }

	 // 判断密码
	 $('input[data-valid="repassword"]').on('change', function() {
	 	var value = $('input[data-valid="password"]').val();
	 	var value1 = $(this).val();
	 	if (value1 == value) {
	 		data['repassword'] = false;
	 	} else {
	 		data['repassword'] = true;
	 	}
	 })

	$('form.adminUI-form').on('submit', function(e) {
		if (data.mobile || data.email || data.number || data.integer || data.checkbox || data.apiKey || data.peroid || data.repassword) {
			e.preventDefault();
			var dialog = {
				info: '请检查您填写的内容再提交'
			}	
			cusDialog(dialog);
		}
	})



// })
